<template>
  <div class="infinite-container bgJybg">
    <div class="pageTop">
      <h2>{{familyPerson.realname}}</h2>
      <h4>{{mainInfo.departmentName}}</h4>
      <span class="circleBtn">{{mainInfo.checkName || '暂无数据'}}</span>
    </div>
    <div class="flex flex_between part1" >
      <p>
        <span class="fGray">送检医生</span>
        <span class="fGreen">{{mainInfo.doctorName}}</span>
      </p>
      <p>
        <span class="fGray">送检时间</span>
        <span class="fGreen">{{mainInfo.checkTime | format('yyyy-MM-dd hh:mm:ss') }}</span>
      </p>
    </div>
    <div class="part2" v-for="item in mainInfo.reportContents">
      <div class="part2Title">{{item.itemName}}</div>
      <div class="part2Content">{{item.itemContent}}</div>
    </div>
    <div class="flex flex_between part1" >
      <p>
        <span class="fGray">报告医生</span>
        <span class="fGreen">{{mainInfo.reporter}}</span>
      </p>
      <p>
        <span class="fGray">报告时间</span>
        <span class="fGreen">{{mainInfo.reportTime | format('yyyy-MM-dd hh:mm:ss') }}</span>
      </p>
    </div>
  </div>
</template>

<script>
  export default {
    data () {
      return {
        familyPerson: JSON.parse(sessionStorage.familyPerson),
        mainInfo: {
          examTime: '',
          reportTime: ''
        }
      }
    },
    components: {

    },
    mounted () {
      this.mainInfo = this.$route.query
      console.log(JSON.stringify(this.mainInfo))
    },
    methods: {

    }
  }
</script>

<style scoped lang="less">
  @import "../../common/css/flex.css";
  @import "../../common/css/vars";
  .bgJybg{
    background-image: url("../../assets/images/bg_jybg_xq.png");
    background-repeat: no-repeat;
    background-size:100%;
  }
  .pageTop{
    padding:26px 0 20px 0;
    text-align: center;
    color:white;
    h2,h4{
      font-weight:normal;
    }
    h4{
      padding:5px 0;
    }
  }
  .part1{
    background-color: white;
    padding:10px;
  }
  .fGreen{
    color:@color-primary
  }
  .fGray{
    color:@color-gray
  }
  .part2{
    background-color: white;
    margin:10px 0;
    .part2Title{
      border-bottom: 1px solid @color-border;
      border-left:5px solid @color-primary;
      padding:5px 10px;
      color:@color-gray
    }
    .part2Content{
      padding:10px;
    }
  }
</style>
